<template>
    <div class="GetPeople">
        乘车人数：
        <select v-model="selectedNumber">
            <option :value="item" v-for="(item, index) in arr" :key="index">{{ item }}</option>
        </select>
    </div>
</template>

<script setup>
import { ref } from 'vue';

// 创建一个数组来存储乘车人数选项
const arr = ref([1, 2, 3, 4, 5, 6, 7, 8, 9]);

// 创建一个响应式变量来存储当前选中的值
const selectedNumber = defineModel()


import { watch } from 'vue';
watch(selectedNumber, (People, oldValue) => {
    // console.log('Selected number changed from', oldValue, 'to', newValue);
    // console.log(People)

    // console.log(selectedNumber.value)
});
</script>

<style scoped>
.GetPeople {
    display: flex;
    align-items: center;
    margin-top: 1rem;
    margin-left: 1rem;
}

select {
    width: 12.6rem;
    height: 2rem;
}
</style>